
<!DOCTYPE html>
<html lang='zh-CN'>
<head>
	<meta charset='utf-8'>
	<meta content='IE=edge' http-equiv='X-UA-Compatible'>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>websocket</title>
	<link rel="stylesheet" href="js/bootstrap/3.2.0/css/bootstrap.min.css">
	<link rel="stylesheet" href="js/bootstrap/3.2.0/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="js/bootstrap/3.2.0/css/docs.css">
    <script>
        window.console = window.console || {
            log:function(){}
        }
    </script>
	<script src="js/jquery.min.js"></script>
    <script src="js/jquery.json-2.4.js"></script>
    <script src="js/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    <script src="js/flash-websocket/swfobject.js"></script>
    <script src="js/MaoSuiWebSocket.js"></script>
    <script src="js/swfJs/interview.js"></script>
</head>
<body>
	<div class="container">
        <!--<form action="" name="d" id="d">
            <label for="uid">UID</label>
            <input id="uid" type="text" value="2" name="uid"/>
            <br/>
            <fieldset>
                <legend>用户类型</legend>
                <input id="userType" checked type="radio" name="userType" value="1"/>
                <input type="radio" name="userType" value="2"/>
            </fieldset>
            <label for="cid">岗位ID</label>
            <input id="cid" name="cid" type="text" value="1"/>
        </form>-->
        <div id="liveMedia"></div>
		<div class="page-header">
			<h1>
                求职者:
				<small id="queueText"> </small>
			</h1>
		</div>
		<div class="panel panel-default">
            <div class="panel-body">
                
            </div>
		</div>
            <div class="form-group has-success has-feedback">
                <label class="control-label" for="message">请文明发言,勿刷屏,按回车键发送消息</label>
                <input type="text" class="form-control" id="message" placeholder="输入你想对大家说的话">
            </div>
	</div>
	<script>
	   var Server;
       var interView = new InterView('liveMedia');
	   $(function(){
           log('连接中...', 'info');
           var uid = location.hash.substr(1);
           if(uid == 0 || uid == ""){
               uid = 3;
           }
           Server = new LiveServer("ws://"+location.hostname+":8080/live",{uid:uid,cid:701});
           
           Server.bind('open', function() {
               this.sendEvent("init", {a:3})
           });
           Server.bind("init", function(e){
              console.log("init",e)
               $('#queueText').html('你排队列中第' + e.queueIndex + "位");
               log( "连接成功. 你排第" + e.queueIndex + '位', 'success');
           });
           Server.bind('close', function( data ) {
               log( "已经断开.", 'danger');
           });
           Server.bind('message', function( payload ) {
        	   addMessage(payload, 'left', 'primary');
           });
           Server.bind('init_success', function(data){
               log("初始化成功: " + new Date(data).toLocaleString());
           });
           Server.bind('liveInit', function(data){
               if(!data || !data.liveId)return;
               if(confirm("企业通知你面试,是否同意?")){
                   Server.sendEventToUser(0,'agent', uid);
                   interView.publish(uid);
                   interView.receive(data.liveId);
               }
              //addMessage('企业通知你面试,是否<a href="javascript:Server.sendEventToUser(0,\'agent\','+d.uid.value +');">同意</a>?');
           });

           //排队顺序更新
           Server.bind("queue", function(queueIndex){
               $('#queueText').html('你排队列中第' + queueIndex + "位");
           });

           Server.bind('company_offline',function(){
               log("企业端已离线!",'danger');
              //Server.disconnect();
           });
           Server.bind('company_online',function(){
               log("企业端已上线!",'success');
           });
           Server.bind('error',function(data){
               console.log('error', data)
           });

           Server.bind('hangUp', function(id){
               interView.hangUp();
               addMessage("对方已挂断!")
           });

           Server.connect();

           interView.init = function(self){
               console.log("swf 加载成功");
           };
           //设备选择成功
           interView.equipOK = function(){
               //Server.connect();
           };

           interView.activeOff = function(){
               if(confirm("你确定要断开当前视频？")){
                   interView.hangUp();
                   Server.sendEventToUser(0, 'hangUp', uid);//向企业发送挂断信息
               }
           };

           interView.__init('js/');


           
		   // 绑定消息框
           $('#message').keypress(function(e) {
               if ( e.keyCode == 13 && this.value ) {
            	   addMessage($(this).val(), 'right');
            	   if(Server.send( 'message', $(this).val()) === false){
            		   log('没有连接服务器!', 'danger');
            	   };
                   $(this).val('');
               }
           });
	   });
	   
	   
	   // 将消息上屏
	   function addMessage(msg, x, y){
           if(!y){
               y="success";  
           }
		   
           $('<p class="text-' + x + '">\
                   <span class="label label-' + y + '">' + msg + '</span>\
              </p>').appendTo('.panel-body');
           
           $log = $('.panel-body');
           $log[0].scrollTop = $log[0].scrollHeight - $log[0].clientHeight;
	   }
	   function log(msg, x){
		   if(!x){
			   x="success";  
		   }
		   $('<div class="alert alert-' + x + '" role="alert">' + msg + '</div>').appendTo('.panel-body')
		   $log = $('.panel-body');
           $log[0].scrollTop = $log[0].scrollHeight - $log[0].clientHeight;
	   }

	</script>
</body>
</html>